// eslint-disable-next-line no-unused-vars
import VXETable, { Column } from 'vxe-table'
import { FLAG_COLOR } from '@Components/assets/js/config'
import createBem from '@Components/assets/js/utils/bem'
import { tableNamespace } from '../../../config'
import './index.scss'

const Bem = createBem(`${tableNamespace}__flag-tag`)

VXETable.renderer.add('FlagTag', {
  renderDefault(h, renderOpts, params) {
    const { row, column } = params
    const current = FLAG_COLOR[row[column.property]]
    return [
      current && (
        <i
          class={`${Bem()} el-icon-s-flag flag__color${row[column.property]}`}
          title={current.text}
        />
      )
    ]
  }
})

/** @type { Column } */
export const options = {
  showOverflow: 'ellipsis',
  align: 'center'
}
